<template>
  <div>
    <div>
      <el-dialog
        title="指派人员"
        :visible.sync="dialogVisible"
        width="30%"
        >
        <div>
          选择人员： <el-select  v-model="chooseuser">
            <el-option
                  v-for="item in userList"
                  :key="item.name"
                  :label="item.name"
                  :value="item.name"/>
          </el-select>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false;chooseuser=''" style="margin-top: 40px;">取 消</el-button>
          <el-button type="primary" @click="chooseSure">确 定</el-button>
        </span>
      </el-dialog>

      <el-table :data="tableData"  border stripe='true'>

      	<el-table-column prop="id" label="编号" align="center"></el-table-column>

      	<el-table-column prop="content" label="内容" show-overflow-tooltip="true"  align="center"></el-table-column>

      	<el-table-column prop="type" label="类型"  align="center" ></el-table-column>

      	<el-table-column prop="createUser" label="创建人" align="center"></el-table-column>

      	<el-table-column prop="createTime" label="创建时间" align="center"></el-table-column>

        <el-table-column prop="handler" label="操作" align="center" width="280px;">
        	<template slot-scope="scope">
        		<el-button size="mini" type='primary' @click='open(scope.$index, scope.row)'>指派人员</el-button>
        	</template>
        </el-table-column>
      </el-table>
      <el-pagination
            style="margin-top: 20px;"
            @current-change="handleCurrentChange"
            :current-page.sync="currentPage1"
            :page-size="pageSize"
            background='true'
            layout="total, prev, pager, next"
            :total="totleSize">
      </el-pagination>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'service2',
    data() {
      return {
        tableData:[{

        }],
        dialogVisible:false,
        userList:[],
        chooseuser:"",
        pageSize:5,
        currentPage1:1,
        totleSize:0,
        id:'',
      };
    },
    components: {

    },
    mounted() {

    },
    beforeDestroy() {

    },
    computed:{

    },
    methods: {
      getdata() {
        this.getRequest('/service/getStateList?state=新创建&beginPage='+this.currentPage1+'&pageSize='+this.pageSize)
        .then(successResponse => {
          if (successResponse.data.status == 200) {
            this.tableData=successResponse.data.obj;
            this.totleSize=successResponse.data.totleSize;
          }
          else
            this.$message.error(successResponse.data.msg);
        })
        .catch(failResponse => {
          this.$message.error('网络不通畅');
        })
      },
      handleCurrentChange(val) {
        this.getdata()
      },
      getuserdata() {
        this.getRequest('/getRoleList?role=2')
        .then(successResponse => {
          if (successResponse.data.status == 200) {
            this.userList=successResponse.data.obj;
          }
          else
            this.$message.error(successResponse.data.msg);
        })
        .catch(failResponse => {
          this.$message.error('网络不通畅');
        })
      },
      open(index, row){
        this.dialogVisible=true;
        this.getuserdata();
        this.id=row.id;
      },
      chooseSure(){
        this.dialogVisible = false;
        this.postRequest('/service/allot',{
          allot:this.chooseuser,
          id:this.id
        })
        .then(successResponse => {
          if (successResponse.data.status == 200) {
            this.$message.success("指派成功！");
            this.getdata();
          }
          else
            this.$message.error(successResponse.data.msg);
        })
        .catch(failResponse => {
          this.$message.error('网络不通畅');
        })
      }
    },
  };
</script>

<style>

</style>
